<template>
  <div class="page-container">
    <DetailBanner v-if="showCollectEntry">
      样例列表
    </DetailBanner>
    <div v-else style="padding-top: 100px" />
    <div v-if="showCollectEntry" class="fav-entry page-content">
      <el-button plain class="fav-entry-btn" @click="collectPage">
        <svg-icon icon="folder" size="0.1rem" />
        我的收藏
      </el-button>
    </div>
    <div class="page-content">
      <SetPath v-if="showCollectEntry" path="样例列表" />
      <SetPath v-else :path="[{label: '样例列表', path: '/case'}, {label: '我的收藏'}]" />
      <div class="section section-aliceblue" style="margin-bottom: 80px;">
        <!-- <div class="section-head">
            <p class="section-title">病例列表</p>
        </div> -->
        <CaseList/>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, computed, reactive } from 'vue'
import UserHeader from '@/pages/home/UserHeader.vue';
import CommonFooter from '@/pages/home/CommonFooter.vue';
import CaseList from './CaseList.vue';
import { useRoute, useRouter } from 'vue-router'
import { ElMessageBox, ElMessage } from 'element-plus';
import SetPath from '@/pages/layout/component/SetPath.vue'
import DetailBanner from '@/pages/layout/component/DetailBanner.vue'

const router = useRouter()
const route = useRoute()

const showCollectEntry = computed(() => {
  return route.name !== 'CollectCase'
})
//登录相关
// const user = useUser(); // 相当于setup方法
let user = JSON.parse(sessionStorage.getItem('userInfo')) ? JSON.parse(sessionStorage.getItem('userInfo')) : {}


//首页前端栏

const defaultActive = () => '/' + (route.path.split('/')[1] || '')
const toHome = () => router.push('/')
const goPage = (path: any) => {
    router.push({ path })
}
/**
 * 判断是否为白底背景
 */
const isWhiteBg = computed(() => {
    for (const m of route.matched) {
        if (m.meta && m.meta.whiteBg) {
            return true
        }
    }
    return false
})

const showMore = () => {
    user = JSON.parse(sessionStorage.getItem('userInfo')) ? JSON.parse(sessionStorage.getItem('userInfo')) : {}
    if (user.nickName) {
        router.push('/case')
    } else {
        ElMessage.error('请登录后查看')
    }
}

function collectPage() {
  router.push('/case/collect')
}
</script>
<style lang='scss' scoped>
.fav-entry {
  width: 100%;
  position: relative;

  .fav-entry-btn {
    width: 116px;
    height: 40px;
    position: absolute;
    top: -80px;
    right: 0;
    border-radius: 20px;
    background-color: #36CDFD;
    :deep(svg) {
      margin-right: 4px;
    }
  }
}
</style>